<template>
  <div id="app">
    <v-header :seller="seller"></v-header>
    <tab :data="tabs"></tab>
  </div>
</template>

<script>

import {getSeller} from 'api'                  //导入方法 1
// import api from 'api'                          //导入方法 2
import VHeader from './components/header/header'
import Tab from './components/tab/tab'

import Goods from './components/goods/goods'
import Ratings from './components/ratings/ratings'
import Seller from './components/seller/seller'

export default {
  name: 'app',
  data(){
    return{
      seller: {},
        tabs:[
            {
                label: '商品',
                icon: 'cubeic-home',
                component: Goods,
            },
            {
                label: '哈哈哈啊',
                icon: 'cubeic-vip',
                component: Ratings,
            },
            {
                label: '商家',
                icon: 'cubeic-like',
                component: Seller,
            },
        ],
        initialIndex: 1,
    }
  },
  components: {
    VHeader, Tab,
    Goods, Ratings, Seller,
  },
  mounted(){
    getSeller().then((res)=>                   //调用写法 1
    // api.getSeller().then((res)=>               //调用写法 2
            this.seller= Object.assign({}, res)
    )
  }
}
</script>


<style lang="stylus">
body, html
  height:100%;
#app
  display:flex;
  flex-direction: column;
  height:100%;
</style>


